<template>
<div id="app-save">
    <el-card shadow="always">
  <el-form ref="form" :model="emp" label-width="80px">
    <el-form-item label="员工姓名">
      <el-input v-model="emp.ename"></el-input>
    </el-form-item>
    <el-form-item label="生日">
        <el-date-picker v-model="emp.bdate" type="date" placeholder="生日" style="width: 200px">
        </el-date-picker>
    </el-form-item>
    <el-form-item label="性别">
      <el-radio-group v-model="emp.sex">
        <el-radio label="M" >男</el-radio>
        <el-radio label="F" >女</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="所在城市">
      <el-input v-model="emp.city"></el-input>
    </el-form-item>
    <el-form-item label="部门">
      <el-select v-model="emp.did" placeholder="请选择部门">
        <el-option v-for="d in deptList" :label="d.dname" :value="d.did" :key="d.did"></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="入职时间">
        <el-date-picker v-model="emp.startdate" type="date" placeholder="入职时间" style="width: 200px">
        </el-date-picker>
    </el-form-item>
    <el-form-item label="工资">
      <el-input v-model="emp.salary"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="saveEmp">保存</el-button>
      <el-button type="primary" @click="cancel">取消</el-button>
    </el-form-item>
  </el-form>
  </el-card>
  </div>
</template>
<script>
import empApi from "@/api/emp/emp";
import deptApi from "@/api/emp/dept";

export default {
  data() {
    return {
      emp: {},
      deptList: [],
    };
  },

  created() {
    this.findAllDept()
    let eid = this.$route.query.eid;
    if (eid) {
      this.findEmp(eid)
    }
  },

  methods: {
    findEmp(eid) {
        empApi.findEmpById(eid).then(resp => {
            this.emp = resp.data.emp;

            console.log(this.emp)
        })
    },

    //查询所有部门
    findAllDept() {
      deptApi.findAllDept().then((resp) => {
        this.deptList = resp.data.list;
      });
    },

    //取消
    cancel() {
      this.$router.push("/emp/list");
    },

    saveEmp() {
      if (this.emp.eid) {
        //有id为修改操作
        this.updateEmp();
      } else {
        this.addEmp();
      }
    },

    //修改学生
    updateEmp() {
      empApi.updateEmp(this.emp).then((resp) => {
        if (resp.code == 0) {
          this.$message({
            message: resp.message,
            type: "success",
          });
        }

        this.$router.push("/emp/list");
      });
    },

    //添加学生
    addEmp() {
        console.log(this.emp);
        
      empApi.addEmp(this.emp).then((resp) => {
        if (resp.code == 0) {
          this.$message({
            message: resp.message,
            type: "success",
          });
        }

        this.$router.push("/emp/list");
      });
    },
  },
}
</script>

<style>
    #app-save{
        width: 800px;
        margin: 100px auto;
    }

</style>